<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://unpkg.com/vue"></script>
    <script>
        window.onload=function(){
            var vm = new Vue({
                el: '#example',
                data: {
                    message: 'Hello'
                },
                computed: {
                    // a computed getter
                    reversedMessage: function () {
                        // `this` points to the vm instance
                        return this.message.split('').reverse().join('')
                    }
                }
            })
        }
    </script>
</head>
<body>
<div id="example">
    <p>Original message: "{{ message }}"</p>
    <p>Computed reversed message: "{{ reversedMessage }}"</p>
</div>
</body>
</html>